/*：root用于设置全局CSS变量，可以在整个文档中使用*/
:root {

    --x: 45deg;

}

.container-floor-select {
    display: flex;
    flex-direction: row;
    justify-content: center;
    overflow: hidden;
    transition: 0.4s;

    /* display: none; */
}

/* slider-container的宽度=floor的宽度+其margin */
.slider-container {
    display: flex;
    flex-direction: row;
    /* justify-content: center; */
    align-items: center;
    width: 140px;
    overflow: hidden;
}

.slider {

    padding-inline-start: 0px;
    margin-block: 0px;
    list-style: none;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    transition: 0.4s;


}

.floor {
    /* 去除列表默认属性 */
    list-style: none;
    width: 120px;
    margin: 0 10px;
    /* 水平居中 */
    text-align: center;
    padding: 10px;
    font-size: 0.9em;
    font-weight: bolder;
    color: linear-gradient(var(--x), #a476d6, #404ac0, #0c37e4, #d89aee);



}

.active-floor {
    cursor: pointer;
    background: linear-gradient(var(--x), #a476d6, #404ac0, #0c37e4, #d89aee);
    border-radius: 7px;
    color: whitesmoke
}


.btn:hover {
    cursor: pointer;

    transform: scale(1.1);
}

.btn {
    /* 修改为行盒 */

    display: inline-block;
    text-align: center;
    /* 垂直居中 */
    height: 40px;
    line-height: 20px;
    margin: 10px 15px;
    padding: 10px 25px;



    font-weight: bold;
    border: rgba(22, 214, 255, .9) solid 1px;
    border-radius: 5px;
}

.icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}